ব্রাউজার অবজেক্ট মডেল(BOM) জাভাস্ক্রিপ্টের সাথে ব্রাউজারের সম্পর্ক তৈরি করে।

ব্রাউজার অবজেক্ট মডেল(BOM)

ব্রাউজার অবজেক্ট মডেলের(BOM) জন্য অফিসিয়াল কোনো স্ট্যান্ডার্ড নেই।

যেহেতু আধুনিক ব্রাউজারে জাভাস্ক্রিপ্টের একই মেথড এবং প্রোপার্টি দেয়া আছে,তাই এগুলোকে BOM এর মেথড এবং প্রোপার্টি হিসেবে বিবেচনা করা হয়।

উইন্ডো অবজেক্ট

উইন্ডো অবজেক্ট সকল ব্রাউজারে সাপোর্ট করে। এটা ব্রাউজারের উইন্ডো প্রদর্শন করে।

সকল গ্লোবাল জাভাস্ক্রিপ্ট অবজেক্ট, ফাংশন এবং ভ্যারিয়েবলগুলো স্বয়ংক্রিয়ভাবেই উইন্ডো অবজেক্টের মেম্বার হয়ে যায়।

গ্লোবাল ভ্যারিয়েবল হলো উইন্ডো অবজেক্টের প্রোপার্টি।

গ্লোবাল ফাংশন হলো উইন্ডো অবজেক্টের মেথড।

এমনকি ডকুমেন্ট অবজেক্টও(এইচটিএমএল ডোমের) উইন্ডো অবজেক্টের একটি প্রোপার্টিঃ

kt_satt_skill_example_id=1542

এটার মতোঃ

kt_satt_skill_example_id=1543

উইন্ডো সাইজ

ব্রাউজার উইন্ডোর আকার জানতে দুইটি প্রোপার্টি ব্যবহার করা যেতে পারে।

উভয় প্রোপার্টির সাইজ পিক্সেল হিসেবে রিটার্ন হয়ঃ

• window.innerHeight - ব্রাউজার উইন্ডোর ভেতরের উচ্চতা
• window.innerWidth - ব্রাউজার উইন্ডোর ভেতরের প্রস্থ

ব্রাউজার উইন্ডোর (ব্রাউজার ভিউপোর্ট) টুলবার এবং স্ক্রলবার এর অন্তর্ভুক্ত নয়।

IE5-8 ভার্সনের জন্যঃ

• document.documentElement.clientHeight
• document.documentElement.clientWidth
• অথবা
• document.body.clientHeight
• document.body.clientWidth

সকল ব্রাউজারে সাপোর্ট করানোর জন্য কার্যকরী জাভাস্ক্রিপ্ট উদাহরণঃ

kt_satt_skill_example_id=1545

এই উদাহরণটি ব্রাউজার উইন্ডোর উচ্চতা এবং প্রস্থ প্রদর্শন করছে( টুলবার/স্ক্রলবার ছাড়া)ঃ

অন্যান্য উইন্ডো মেথড

আরো কিছু মেথডঃ

• window.open() - নতুন উইন্ডো খোলে
• window.close() - বর্তমান উইন্ডোটিকে ক্লোজ করে
• window.moveTo() - বর্তমান উইন্ডোটিকে সড়িয়ে নেয়
• window.resizeTo() - বর্তমান উইন্ডোর আকার পরিবর্তন করে

window.screen অবজেক্ট ব্যবহারকারীর স্ক্রিন সম্পর্কে তথ্য ধারণ করে।

উইন্ডো স্ক্রিন

window.screen অবজেক্টকে window ছাড়াও লিখা যেতে পারে।

প্রোপাটিঃ

• screen.width
• screen.height
• screen.availWidth
• screen.availHeight
• screen.colorDepth
• screen.pixelDepth

উইন্ডো স্ক্রিনের প্রস্থ

screen.width প্রোপার্টিটি ব্যবহারকারীর স্ক্রিনের প্রস্থ পিক্সেলে রিটার্ন করে।

kt_satt_skill_example_id=1549

উইন্ডো স্ক্রিনের উচ্চতা

screen.height প্রোপার্টিটি ব্যবহারকারীর স্ক্রিনের উচ্চতা পিক্সেলে রিটার্ন করে।

kt_satt_skill_example_id=1550

উইন্ডো স্ক্রিনের ব্যবহারযোগ্য প্রস্থ

screen.availWidth প্রোপার্টিটি উইন্ডো টাস্কবার বাদ দেওয়ার পর ব্যবহারকারীর স্ক্রিনের প্রস্থ পিক্সেলে রিটার্ন করে।

kt_satt_skill_example_id=1551

উইন্ডো স্ক্রিনের ব্যবহারযোগ্য উচ্চতা

screen.availHeight প্রোপার্টিটি উইন্ডো টাস্কবার বাদ দেওয়ার পর ব্যবহারকারীর স্ক্রিনের উচ্চতা পিক্সেলে রিটার্ন করে।

kt_satt_skill_example_id=1552

উইন্ডো স্ক্রিনের কালারের গভীরতা

screen.colorDepth প্রোপার্টিটি একটি রং প্রদর্শনের জন্য কত বিট ব্যবহার করা হয় তা রিটার্ন করে।

আধুনিক সকল কম্পিউটার গুলোতেই কালার রেজুলেশনের জন্যে ২৪ বা ৩২ বিটের হার্ডওয়্যার ব্যবহার করা হয়ঃ

• ২৪ বিট =      ১৬,৭৭৭,২১৬ টি কালার রয়েছ।
• ৩২ বিট = ৪,২৯৪,৯৬৭,২৯৬ টি কালার রয়েছে।

সাধারণত পুরনো কম্পিউটারগুলোতে ১৬ বিট ব্যবহার করা হয় যার মাঝে শুধু ৬৫,৫৩৬ টি পৃথক কালার ব্যবহার করা যায়।

এর চেয়েও পুরোনো কম্পিউটার বা মোবাইলগুলোতে ৮বিট ব্যবহার করা হয়েছে।যেখানে শুধু ২৫৬ টি পৃথক "VGA" কালার ব্যবহার করা যেতো।

kt_satt_skill_example_id=1555

উইন্ডো স্ক্রিনের পিক্সেলের গভীরতা

screen.pixelDepth প্রোপার্টিটি স্ক্রিনের পিক্সেলের গভীরতাকে প্রকাশ করে।

kt_satt_skill_example_id=1556

আধুনিক কম্পিউটারে কালারের গভীরতা এবং পিক্সেলের গভীরতা সমান হয়।

window.location অবজেক্টটি বর্তমান পেজের ঠিকানা(URL) খুঁজে পেতে এবং ব্রাউজারে নতুন পেজ খুলতে ব্যবহার করা যেতে পারে।

উইন্ডো লোকেশন

window.location অবজেক্টটি window উপসর্গ(prefix) ছাড়াও লিখা যায়।

উদাহরণঃ

• window.location.href বর্তমান পেজের অবস্থান(URL) রিটার্ন করে
• window.location.hostname ওয়েব হোস্টের ডোমেইন নাম রিটার্ন করে
• window.location.pathname বর্তমান পেজের পথ এবং ফাইলের নাম রিটার্ন করে
• window.location.protocol ওয়েবে ব্যবহৃত প্রোটোকলকে(protocol) রিটার্ন করে(http:// অথবা https://)
• window.location.assign দ্বারা একটি নতুন ডকুমেন্ট লোড করা হয়

উইন্ডো লোকেশন href

window.location.href প্রোপার্টিটি বর্তমান পেজের অবস্থান(URL) রিটার্ন করে। অর্থাৎ এই প্রোপার্টিটি ব্যবহার করে আমরা বর্তমানে যে পেজে রয়েছি সেই পেজের অবস্থান দেখতে পারি।

kt_satt_skill_example_id=1570

উইন্ডো লোকেশন hostname

window.location.hostname প্রোপার্টিটি ইন্টারনেট হোস্টের(বর্তমান পেজের) নাম রিটার্ন করে।

kt_satt_skill_example_id=1572

উইন্ডো লোকেশন pathname

window.location.pathname প্রোপার্টিটি বর্তমান পেজের পথ রিটার্ন করে।

kt_satt_skill_example_id=1575

উইন্ডো লোকেশন protocol

window.location.protocol প্রোপার্টিটি পেজের ওয়েব প্রোটোকল রিটার্ন করে।

kt_satt_skill_example_id=1563

উইন্ডো লোকেশন assign

window.location.assign() মেথডটি একটি নতুন ডকুমেন্ট লোড করে।

kt_satt_skill_example_id=1564

window.history অবজেক্টটি ব্রাউজারের হিস্টোরি ধারণ করে।

উইন্ডো হিস্টোরি

window.history অবজেক্টটি window উপসর্গ(prefix) ছাড়াও লেখা যেতে পারে।

ব্যবহারকারীর গৈাপনীয়তা রক্ষা করার জন্য এই অবজেক্টটি এক্সসেসের ক্ষেত্রে জাভাস্ক্রিপ্টের সীমাবদ্ধতা রয়েছে।

কিছু মেথডঃ

• history.back() - ব্রাউজারের মধ্যে পূর্বে ক্লিক করার মতোই
• history.forward() - ব্রাউজারের মধ্যে নেক্সটে ক্লিক করার মতোই

পূর্ববর্তী উইন্ডো হিস্টোরি

history.back() মেথডটি হিস্টোরি লিস্টের পূর্ববর্তী URL কে লোড করে।

এটি অনেকটা ব্রাউজারের পূর্বের পেজে যাওয়ার বাটনে ক্লিক করার মতোই।

kt_satt_skill_example_id=1582

পরর্বতী উইন্ডো হিস্টোরি

history.forward() মেথডটি হিস্টোরি লিস্টের পরবর্তী URL কে লোড করে।

এটি অনেকটা ব্রাউজারের পরবর্তী পেজে যাওয়ার বাটনে ক্লিক করার মতোই।

kt_satt_skill_example_id=1583

window.navigator অবজেক্টটি ব্যবহারকারীর ব্রাউজার সম্পর্কে তথ্য বহন করে।

উইন্ডো নেভিগেটর

window.navigator অবজেক্টটি window উপসর্গ(prefix) ছাড়াও লেখা যেতে পারে।

কিছু উদাহারনঃ

• navigator.appName
• navigator.appCodeName
• navigator.platform

নেভিগেটর কুকি সক্রিয়তা

যদি কুকি সক্রিয় থাকে তবে প্রোপার্টিটি true রিটার্ন করে, অন্যথায় false রিটার্ন করবেঃ

kt_satt_skill_example_id=1584

ব্রাউজারের নাম

appName এবং appCodeName প্রোপার্টিগুলো ব্রাউজারের নাম রিটার্ন করবেঃ

kt_satt_skill_example_id=1585

বিঃদ্রঃ ইন্টারনেট এক্সপ্লোরার ১১, ক্রোম, ফায়ারফক্স এবং সাফারি appName প্রোপার্টির ভ্যালু হিসেবে quot;Netscape" রিটার্ন করে।

ক্রোম, ফায়ারফক্স, ইন্টারনেট এক্সপ্লোরার, সাফারি এবং অপেরার appCodeName প্রোপার্টির ভ্যালু হিসেবে "Mozilla" রিটার্ন করে।

ব্রাউজার ইঞ্জিন

product প্রোপার্টিটি ব্রাউজার ইঞ্জিনের নাম রিটার্ন করবেঃ

kt_satt_skill_example_id=1587

ব্রাউজার ভার্সন(১)

appVersion প্রোপার্টিটি ব্রাউজারের ভার্সন সম্পর্কিত তথ্য রিটার্ন করবেঃ

kt_satt_skill_example_id=1589

ব্রাউজার ভার্সন(২)

userAgent প্রোপার্টিটিও ব্রাউজারের ভার্সন সম্পর্কিত তথ্য রিটার্ন করবেঃ

kt_satt_skill_example_id=1589

সাবধানতা!

নেভিগেটর অবজেক্ট থেকে প্রাপ্ত তথ্য প্রায় বিভ্রান্তিকর হতে পারে এবং ব্রাউজারের ভার্সন সম্পর্কিত তথ্য নির্ণয়ের ক্ষেত্রে ইহা ব্যবহার করা উচিত নয়।

ব্রাউজার প্ল্যাটফর্ম

platform প্রোপাটিটি ব্রাউজার প্লাটফর্ম(অপারেটিং সিস্টেম) রিটার্ন করবেঃ

kt_satt_skill_example_id=1593

ব্রাউজার ভাষা

language প্রোপার্টিটি ব্রাউজারের ভাষা রিটার্ন করবেঃ

kt_satt_skill_example_id=1595

জাভা সক্রিয়তা

জাভা সক্রিয় থাকলে javaEnabled() মেথডটি true রিটার্ন করবেঃ

kt_satt_skill_example_id=1597

জাভাস্ক্রিপ্টে তিন ধরনের পপ-আপ বক্স আছেঃ এলার্ট(alert) বক্স, কনফার্ম(confirm) বক্স এবং প্রোম্পট(prompt) বক্স।

এলার্ট বক্স

ব্যবহারকারীকে তথ্য প্রদানের ক্ষেত্রে নিশ্চিত হওয়ার জন্য প্রায়ই এলার্ট বক্স ব্যবহার করা হয়।

যখন একটি এলার্ট বক্স প্রদর্শিত হয়, ব্যবহারকারীকে "OK" ক্লিক করে পরবর্তী ধাপে যেতে হয়।

গঠনপ্রণালী

kt_satt_skill_example_id=1608

window.alert() মেথডটি window উপসর্গ(prefix) ছাড়াও লিখা যায়।

kt_satt_skill_example_id=1610

কনফার্ম বক্স

কোন একটি বিষয়ে যদি আপনি ব্যবহারকারীকে যাচাই করতে চান অথবা কিছু গ্রহণ করাতে চান সেক্ষেত্রে প্রায়ই কনফার্ম বক্স ব্যবহার করা হয়।

যখন একটি কনফার্ম বক্স প্রদর্শিত হয়, ব্যবহারকারীকে "OK" অন্যথায় "Cancel" ক্লিক করে অগ্রসর হতে হয়।

যদি ব্যবহারকারী "OK" ক্লিক করে, তাহলে বক্সটি "true" রিটার্ন করবে। যদি ব্যবহারকারী "Cancel" ক্লিক করে, তাহলে বক্সটি "false" রিটার্ন করবে।

গঠনপ্রণালী

kt_satt_skill_example_id=1611

window.confirm() মেথডটি window উপসর্গ(prefix) ছাড়া লিখা যায়।

kt_satt_skill_example_id=1612

প্রোম্পট বক্স

একটি পেজে প্রবেশের পূর্বে আপনি যদি ব্যবহারকারীকে দিয়ে কোন একটি ভ্যালু পেতে চান সেক্ষেত্রে প্রোম্পট(prompt) বক্স ব্যবহার করা হয়।

যখন একটি প্রোম্পট(prompt) বক্স প্রদর্শিত হয়, ব্যবহারকারীকে একটি ভ্যালু দেওয়ার পর "OK" অথবা "Cancel" ক্লিক করতে হবে।

যদি ব্যবহারকারী "OK" ক্লিক করে, তাহলে বক্সে দেওয়া ভ্যালু রিটার্ন করে। আর যদি ব্যবহারকারী "Cancel" ক্লিক করে, তাহলে ফাকা(null) ভ্যালু রিটার্ন করে।

গঠনপ্রণালী

kt_satt_skill_example_id=1613

window.prompt() মেথডটি window উপসর্গ(prefix) ছাড়া লিখা যায়।

kt_satt_skill_example_id=1614

লাইন ব্রেক

পপ-আপ বক্সের ভিতরে লাইন ব্রেক প্রদর্শনের জন্য নিম্নলিখিত পদ্বতিটি অনুসরণ করুনঃ

kt_satt_skill_example_id=1615

টাইমিং ইভেন্ট

উইন্ডো অবজেক্ট একটি নির্দিষ্ট সময় অন্তর অন্তর কোড এক্সিকিউশন করতে সাহায্য করে।

এই বিরতি/অন্তরকেই টাইমিং ইভেন্ট বলে।

জাভাস্ক্রিপ্টের সাথে দুইটি প্রধান ইভেন্ট ব্যবহার করা হয়ঃ

• setTimeout(function, milliseconds)
  একটি নির্দিষ্ট সংখ্যক মিলিসেকেন্ড অপেক্ষা করার পর একটি ফাংশন এক্সিকিউট করে।
• setInterval(function, milliseconds)
  setTimeout() ফাংশনের মতই, কিন্তু এক্ষেত্রে ফাংশনটি অবিরত এক্সিকিউশন হতেই থাকে।

	setTimeout() এবং setInterval() দুটোই এইচটিএমএল ডোম(DOM) উইন্ডো অবজেক্টের মেথড।

SetTimeout() মেথড

kt_satt_skill_example_id=1616

window.setTimeout() মেথডটি উইন্ডো উপসর্গ(prefix) ছাড়া লিখা যায়।

প্রথম প্যারামিটারটি হলো একটি ফাংশন যেটি এক্সিকিউশন হবে।

দ্বিতীয় প্যারামিটারটি হলো কতো মিলিসেকেন্ড পর ফাংশনটি এক্সিকিউশন হবে তা নির্দিষ্ট করে।

kt_satt_skill_example_id=1618

এক্সিকিউশন বন্ধ করার কৌশল

setTimeout() মেথড দ্বারা সেট করা ফাংশনের এক্সিকিউশন clearTimeout() মেথডের মাধ্যমে বন্ধ করা হয়।

kt_satt_skill_example_id=1619

window.clearTimeout() মেথডটি window উপসর্গ(prefix) ছাড়া লিখা যায়।

clearTimeout() মেথড setTimeout() মেথড থেকে রিটার্ন করা ভ্যারিয়েবলকে ব্যবহার করেঃ

kt_satt_skill_example_id=1620

যদি ফাংশনটি এক্সিকিউট না করা হয়ে থাকে, তাহলে আপনি clearTimeout() কল করে এক্সিকিউশন বন্ধ করতে পারেনঃ

kt_satt_skill_example_id=1622

setInterval() মেথড

setInterval() মেথডের মাধ্যমে একটি ফাংশনকে নির্দিষ্ট সময় অন্তর অন্তর পুনরাবৃত্তি করা যায়।

kt_satt_skill_example_id=1624

window.setInterval() মেথড window উপসর্গ(prefix) ছাড়া লিখা যায়।

প্রথম প্যারামিটারে ফাংশন থাকে যেটি এক্সিকিউট হবে।

দ্বিতীয় প্যারামিটারে প্রতিবার এক্সিকিউশনের মধ্যবর্তী সময় উল্লেখ করে দেয়া হয়।

এই উদাহরণে প্রতি সেকেন্ডে একবার "myTime" নামের ফাংশনটি এক্সিকিউট হবে(একটি ডিজিটাল ঘড়ির মতো)।

kt_satt_skill_example_id=1625

কিভাবে এক্সিকিউশন বন্ধ করা যায়?

setInterval() মেথড দ্বারা নির্দেশিত ফাংশনের এক্সিকিউশন clearInterval() মেথড দ্বারা বন্ধ করা যায়।

kt_satt_skill_example_id=1626

window.clearInterval() মেথডটি window উপসর্গ(prefix) ছাড়া লিখা যেতে পারে।

clearInterval() মেথড setInterval() মেথড থেকে রিটার্ন করা ভ্যারিয়েবল ব্যবহার করেঃ

kt_satt_skill_example_id=1627

kt_satt_skill_example_id=1628

কুকি আপনাকে ব্যবহারকারীর তথ্য ওয়েব পেজে সংরক্ষন করার সুযোগ দেয়।

কুকি কী?

কুকি হলো আপনার কম্পিউটারে একটি ছোট টেক্সট ফাইল হিসেবে সংরক্ষিত ডাটা।

যখন ওয়েব সার্ভার ব্রাউজারে একটি ওয়েব পেজ পাঠায় এবং সার্ভার ব্যবহারকারী সম্পর্কে সকল তথ্য ভুলে যায় কারণ সার্ভার এবং ব্রাউজারের সাথে তখন কোন সম্পর্ক থাকে না।

"কিভাবে ব্যবহারকারীর সম্পর্কে তথ্য সংরক্ষন করা যায়" এই সমস্যা সমাধান করার জন্যই কুকি উদ্ভাবিত হয়েছেঃ

• যখন একজন ব্যবহারকারী একটি ওয়েবপেজে ভিজিট করে তখন তার নাম কুকি হিসেবে সংরক্ষন করা যায়।
• পরবর্তী সময়ে ব্যবহারকারী যখন ঐ পেজে ভিজিট করে তখন কুকি তাকে চিনতে পারে।

কুকিগুলো জোড়ায় জোড়ায়(name-value) সংরক্ষণ হয়ঃ

kt_satt_skill_example_id=1629

ব্রাউজার থেকে সার্ভারে যখন কোন পেজের জন্য রিকুয়েস্ট পাঠানো হয়, পেজের কুকিগুলোও এই রিকুয়েস্টের সাথে পাঠানো হয়। এই ভাবেই সার্ভার ব্যবহারকারীর সম্পর্কে তথ্য মনে রাখতে পারে।

জাভাস্ক্রিপ্টের মাধ্যমে কুকি তৈরি

document.cookie প্রোপার্টির মাধ্যমে জাভাস্ক্রিপ্ট কুকি তৈরি করতে পারে, পড়তে পারে এবং ডিলেট করতে পারে।

জাভাস্ক্রিপ্টের মাধ্যমে এইভাবে কুকি তৈরি করা যায়ঃ

kt_satt_skill_example_id=1630

এছাড়াও আপনি কুকির মেয়াদ শেষ হওয়ার তারিখ(expiry date) নির্ধারণ করতে পারেন(UTC সময়ে)। ডিফল্টভাবে ব্রাউজার বন্ধ করার সাথে সাথে কুকি ডিলেট হয়ে যায়ঃ

kt_satt_skill_example_id=1631

কুকি কোন পেজের জন্য হবে একটি প্যারামিটারের মাধ্যমে আপনি ব্রাউজারকে বলে দিতে পারেন। ডিফল্টভাবে কুকি বর্তমান পেজের জন্যই নেয়া হয়।

kt_satt_skill_example_id=1632

জাভাস্ক্রিপ্টের মাধ্যমে কুকি পড়া

জাভাস্ক্রিপ্টের মাধ্যমে নিম্নলিখিত উপায়ে কুকি পড়া যায়ঃ

kt_satt_skill_example_id=1633

	document.cookieএকটি স্ট্রিংয়ে সকল কুকিগুলো অনেকটা এইভাবে রিটার্ন করা হয়ঃ cookie1=value; cookie2=value; cookie3=value;

জাভাস্ক্রিপ্টের মাধ্যমে কুকি পরির্বতন

জাভাস্ক্রিপ্টের মাধ্যমে যেভাবে আপনি কুকি তৈরি করেছেন, ঠিক একইভাবে কুকি পরিবর্তন করতে পারেনঃ

kt_satt_skill_example_id=1634

পুরাতন কুকি মুছে ফেলা হয়েছে।

জাভাস্ক্রিপ্টের মাধ্যমে কুকি ডিলেট

কুকি ডিলেট করা খুবই সহজ, শুধুমাত্র "expires" প্যারামিটারে পূর্বের যেকোন তারিখ সেট করে দিতে হয়।

kt_satt_skill_example_id=1635

উল্লেখ্য যে আপনি যখন কুকি ডিলেট করবেন তখন কুকির ভ্যালু নির্ধারণ করা লাগবে না।

কুকি স্ট্রিং

document.cookie প্রোপার্টিটি দেখতে সাধারন টেক্সট স্ট্রিংয়ের মতো দেখায়। কিন্তু এটি সাধারণ স্ট্রিং নয়।

এমনকি আপনি যদি document.cookie তে একটি সম্পূর্ণ কুকি স্ট্রিং লিখেন, যখন আপনি এটি আবার পড়তে যাবেন ,তখন আপনি শুধু name-value এর জোড়ায় জোড়ায় দেখতে পাবেন।

আপনি যদি একটি নতুন কুকি সেট করেন, পুরাতন কুকি মুছে যায় না। নতুন কুকি document.cookie তে যোগ হয়, যদি আপনি পুনরায় document.cookie পড়তে যান তাহলে এমন কিছু দেখতে পাবেনঃ

cookie1=value; cookie2=value;

সকল কুকি প্রদর্শন করি  প্রথম কুকি তৈরি  দ্বিতীয় কুকি তৈরি প্রথম কুকি ডিলেট  দ্বিতীয় কুকি ডিলেট

আপনি যদি একটি সুনির্দিষ্ট কুকির ভ্যালু খুজে পেতে চান, তাহলে আপনাকে অবশ্যই একটি জাভাস্ক্রিপ্ট ফাংশন লিখতে হবে।

জাভাস্ক্রিপ্ট কুকি উদাহরণ

নিচের উদাহরণে আমরা একটি কুকি তৈরি করবো, যা ভিজিটরের নাম সংরক্ষন করবে।

প্রথম বার ভিজিটর যখন ওয়েব পেজে প্রবেশ করবে তখন তাকে তার নাম পূরণ করতে বলা হবে। তারপর নামটি একটি কুকিতে সংরক্ষিত হবে।

পরবর্তীতে ভিজিটর যখন একই পেজে পূনরায় আসে, তখন সে একটি স্বাগত বার্তা পাবে।

উদাহরণস্বরূপ আমরা ৩টি জাভাস্ক্রিপ্ট ফাংশন তৈরি করবোঃ

1. একটি ফাংশন কুকি ভ্যালু সেট করা জন্য
2. একটি ফাংশন কুকি ভ্যালু পাওয়ার জন্য
3. একটি ফাংশন কুকি ভ্যালু চেক করা জন্য

কুকি সেট করার ফাংশন

প্রথমে আমরা একটি ফাংশন তৈরি করি যা ভিজিটরের নাম একটি কুকি ভ্যারিয়েবলে সংরক্ষন করবেঃ

kt_satt_skill_example_id=1637

উদাহরণের ব্যাখ্যাঃ

উপরে ফাংশনের প্যারামিটারগুলোর মধ্যে প্রথমটি হলো কুকির নাম(cname), দ্বিতীয়টি কুকির ভ্যালু(cvalue) এবং শেষেরটি কুকির মেয়াদউত্তীর্ণের তারিখ(exdays)।

ফাংশনটি কুকির নাম, কুকির ভ্যালু এবং স্ট্রিংয়ের মেয়াদউত্তীর্ণের তারিখ একত্রে যুক্ত করে একটি কুকি তৈরি করে।

কুকি পাওয়ার ফাংশন

তারপর আমরা একটি ফাংশন তৈরি করি যেটি কুকির ভ্যালু রিটার্ণ করবেঃ

kt_satt_skill_example_id=1639

ফাংশনের ব্যাখ্যাঃ

কুকির নাম(cname) প্যারামিটার হিসেবে নেয়।

অনুসন্ধানের জন্য cname + "=" টেক্সটের সাহায্যে একটি ভ্যারিয়েবল(name) তৈরি করেছি।

document.cookie কে সেমিকোলনে বিভক্ত করে ca(ca = document.cookie.split(";")) অ্যারেতে রাখি।

ca অ্যারেতে লুপের(i=0;i<ca.length;i++) মাধ্যমে অ্যারের প্রতিটি মান পড়ি(c ‍=ca[i])।

যদি কুকি খুজে পাওয়া যায় (c.indexOf(name) == 0),তাহলে c.substring(name.length,c.length) কুকি ভ্যালু রিটার্ন করে।

আর যদি কুকি না পাওয়া যায়, তাহলে "" রিটার্ন করে।

কুকি চেক করার ফাংশন

সর্বশেষ,আমরা একটি ফাংশন তৈরি করি যা দিয়ে কুকি সেট হয়েছে কিনা তা চেক করে।

যদি কুকি সেট করা থাকে তাহলে এটি একটি স্বাগত বার্তা প্রদর্শন করবে।

আর যদি কুকি সেট করা না থাকে তাহলে setCookie ফাংশন কল করার মাধ্যমে ইহা একটি প্রোম্পট(prompt) বক্স প্রদর্শন করে ব্যবহারকারীর নাম চাইবে এবং ৩৬৫ দিনের জন্য ব্যবহারকারীর নাম সংরক্ষন করবে।

kt_satt_skill_example_id=1640

সকল ফাংশন একসঙ্গে দেয়া হলো

kt_satt_skill_example_id=1641